/**
 * 渲染每一条消息
 */

import React, { Component } from 'react'
import './message-item.less'
export default class MessageItem extends Component {
    componentDidMount() {
        window.scrollTo(0, document.body.scrollHeight)

        // window.scrollTo({
        //     top: document.body.scrollHeight,
        //     behavior: 'smooth'
        // });
    }

    render() {
        // 头部界面
        const { thumb, msg, isME, thumbME, meName, chatName, sendtime } = this.props

        return (
            <div className={`chat-main  ${isME ? 'chat-mine' : ''}`}>
                <div className='chat-user'>
                    <img src={isME ? thumbME : thumb} alt="" />
                    {
                        isME ? <cite>
                            <i>{sendtime}</i>
                            {meName}
                        </cite> : <cite>
                            {chatName}
                            <i>{sendtime}</i>
                        </cite>
                    }

                </div>
                <div className='chat-text'>
                    {msg}
                </div>
            </div>
        )
    }
}